<template>
  <div style="padding:0 17px">
    <div>
            <span>
                <span style="color: #606266;font-size: 14px;line-height: 1;">首页</span>
                <i style="color: #c0c4cc;box-sizing: inherit;content: '\E6E0';"> > </i>
            </span>
      <span>
                <span style="color: #606266;font-size: 14px;line-height: 1;">烟感设备</span>
                <i style="color: #c0c4cc;box-sizing: inherit;content: '\E6E0';"> > </i>
            </span>
      <span>
                <span style="color: #606266;font-size: 14px;line-height: 1;">烟感用户</span>
                <i></i>
            </span>
    </div>
    <div>
      <el-table :data="tableData" border style="width: 100%;margin-top: 20px;color: #909399;font-size: 12px;">
        <el-table-column prop="time" label="索引" width="100"/>
        <el-table-column prop="time" label="用户名" width="100"/>
        <el-table-column prop="name" label="电话" width="150"/>
        <el-table-column align="center" label="操作" fixed="right">
          <template v-slot="scope">
            <el-button type="primary" size="small" icon="Edit" @click="editRole(scope.row)">编辑</el-button>
            <el-button type="danger" size="small" icon="Delete" @click="deleteRole(scope.row.id)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>

      <el-pagination
          :current-page="currentPage"
          :page-size="pageSize"
          :page-sizes="[10, 20, 30, 50]"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
          :background="true"

          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
      />
    </div>
  </div>
</template>

<script>
export default {
  name: "SmokeSensingUser",
  data() {
    return{
      search: '',
      tableData: [],
      currentPage: 1,
      pageSize: 10,
      total: 10,
    }
  },
  methods: {
    // 搜索
    load(){

    },
    handleSizeChange(pageSize) {   // 改变当前每页的个数触发
      this.pageSize = pageSize
      this.load()
    },
    handleCurrentChange(pageNum) {  // 改变当前页码触发
      this.currentPage = pageNum
      this.load()
    },
  }
}
</script>

<style scoped>
:deep(.el-table th .cell) {
  font-weight: 700
}
</style>
